<template>
    <view class="bg-[#F8F8F8] min-h-screen">
        <view class="flex items-center py-[26rpx] bg justify-between pr-[46rpx]">
            <view class="flex items-center ml-[105rpx]">
                <view class="w-[105rpx] h-[105rpx] relative">
                    <image class="w-[105rpx] h-[105rpx]"
                        src="https://gangantao.com/image/20241216/1ee10869-16bf-4e3a-b607-4aad213c4534.png"></image>
                    <view
                        class=" absolute w-[105rpx]  text-center text-[#fff] bg-[#FD755D] bottom-0 text-[24rpx] rounded">
                        官方授权
                    </view>
                </view>
                <view class="text-[#3D3D3D] font-medium ml-[38rpx] text-[46rpx]">
                    青秀区老年大学
                </view>
            </view>

            <u-icon name="arrow-right" color="#444444" size="20"></u-icon>

        </view>
        <view 
            class=" px-[38rpx] flex justify-between bg-white pt-[14rpx] pb-[20rpx] text-[32rpx] font-normal">
            <view @click="navigateTo('/pages/schoolProfile/schoolProfile')" class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dcc4afdb9.png"></image>
                <view class="mt-[24rpx]">学校简介</view>
            </view>
            <view @click="navigateTo('/pages/enrollmentInformation/enrollmentInformation')" class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dcff2e23e.png"></image>
                <view class="mt-[24rpx]">招生信息</view>
            </view>
            <view @click="navigateTo('/pages/teachingActivity/teachingActivity')" class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dcff11158.png"></image>
                <view class="mt-[24rpx]">教学活动</view>
            </view>
            <view @click="navigateTo('/pages/classTeam/classTeam')"  class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dcfef068a.png"></image>
                <view class="mt-[24rpx]">班级团队</view>
            </view>
        </view>
        <view
            class=" px-[38rpx] flex justify-between bg-white pt-[14rpx] pb-[20rpx] text-[32rpx] font-normal">
            <view @click="navigateTo('/pages/newsCenter/newsCenter')" class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dcfed6e40.png"></image>
                <view class="mt-[24rpx]">新闻中心</view>
            </view>
            <view @click="navigateTo('/pages/collegeStyle/collegeStyle')"  class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dcfea8a78.png"></image>
                <view class="mt-[24rpx]">学员风采</view>
            </view>
            <view @click="navigateTo('/pages/teachingStaff/teachingStaff')" class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dd4d7c4d5.png"></image>
                <view class="mt-[24rpx]">师资队伍</view>
            </view>
            <view @click="navigateTo('/pages/licenseManagement/licenseManagement')" class="flex flex-col justify-center items-center">
                <image class="h-[110rpx] w-[110rpx]"
                    src="https://tcimg.yangjc.com/upload/images/2024-12-22/6767dd4d49bc0.png"></image>
                <view class="mt-[24rpx]">证照管理</view>
            </view>
        </view>
        <view class="mt-[28rpx] mb-[20rpx] flex mx-[30rpx] justify-between text-[46rpx]">
            <view @click="navigateTo('/pages/skyclass/skyclass')" class="w-[328rpx] h-[142rpx] bg1 text-white flex items-center justify-center font-bold">空中课堂</view>
            <view @click="navigateTo('/pages/enrollment/enrollment')" class="w-[328rpx] h-[142rpx] bg2 text-white flex items-center justify-center font-bold relative">招生报名<view class=" absolute left-1 top-0 font-normal text-[26rpx]">有活动进行中~~</view></view>
        </view>
        <view v-for="(item, index) in 3" :key="index"
      class="mt-[16rpx] shadow ml-[12rpx] mr-[18rpx] bg-white pl-[30rpx] pr-[10rpx] pt-[20rpx]">
      <view class="text-[#3D3D3D]  mb-[12rpx] flex justify-between items-end"><text
          class="text-[32rpx]">风祥小区教学点</text><text class="text-[28rpx] ">3.8km</text>
      </view>
      <view class="flex pb-[26rpx]">
        <image class="w-[200rpx] h-[200rpx]"
          src="https://gangantao.com/image/20241216/da0e780c-e279-4d0e-be12-9ab9486ffaf7.png"></image>
        <view class="ml-[16rpx] flex-1 flex flex-col justify-between h-[200rpx]">
          <view class="flex items-start justify-between w-full">
            <view class="flex items-start">
              <view class=" text-white text-[28rpx] bg-[#FD755D] rounded px-1  mr-[12rpx] tracking-wider">一级学院</view>
              <view class=" text-white text-[28rpx] bg-[#FD755D] rounded px-1">二级学院</view>
            </view>
            <view class="text-[#FF0000] text-[44rpx]">68元</view>
          </view>
          <view class="text-[32rpx] text-[#3D3D3D]">楷书毛笔字课程</view>
          <view class="text-[28rpx] text-[#3D3D3D] ">2024.10.10</view>
          <view class="flex items-end justify-between">
            <view class="flex">
              <view class=" text-white text-[28rpx] bg-[#FFA812] rounded px-1 mr-[12rpx]">学分兑换</view>
              <view class=" text-white text-[28rpx] bg-[#FFA812] rounded px-1 mr-[12rpx]">免费</view>
              <view class=" text-white text-[28rpx] bg-[#FFA812] rounded px-1">艺术</view>
            </view>

            <view class=" text-white py-[10rpx] px-4 bg-[#FD755D] rounded  text-[32rpx]">预约</view>
          </view>
        </view>
      </view>
    </view>
    </view>
</template>
<script setup>
import { ref } from "vue";
const navigateTo =(url)=>{
  uni.navigateTo({
    url
  })
}
</script>
<style scoped>
.bg {
    background: linear-gradient(138deg, #F6E7E5 0%, rgba(251, 216, 210, 0) 100%);
}
.bg1{
    background-image: url('https://tcimg.yangjc.com/upload/images/2024-12-22/6767dd8c980a7.png');
    background-size: cover;
}
.bg2{
    background-image: url('https://tcimg.yangjc.com/upload/images/2024-12-22/6767dd8c58a60.png');
    background-size: cover;
}
</style>